<template>

  <div class="app-container">
    <div style="text-align: center;margin-bottom: 30px">
      反馈单{{createStatus?'新增':'更新'}}
    </div>
    <div style="width: 50%;margin:0px auto;vertical-align:middle;height:100%">
      <el-form :model="maintenanceFrom" ref="maintenanceFrom" :rules="mastercardlogFromRules" label-width="100px">

        <el-form-item label="反馈人" prop="reportPersonName" >
          <el-select v-model="maintenanceFrom.reportPersonName" placeholder="请选择" style="width: 100%" >
            <el-option v-for="(item,index) in reportPersonList" :key="index"  :value="item.ucId" :label="item.name" ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="工单名称" prop="maintenanceRecordName" >
          <el-select v-model="maintenanceFrom.maintenanceRecordName" placeholder="请填写" style="width: 100%" >
            <el-option v-for="(item,index) in maintenanceRecordIdList" :key="index"  :value="item.ucId" :label="item.name" ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="工单状态" prop="maintenanceRecordType">
          <el-select v-model="maintenanceFrom.maintenanceRecordType" placeholder="请选择工单状态" style="width: 100%">
            <el-option :value="0" label="已上报" ></el-option>
            <el-option :value="1" label="分配完成"></el-option>
            <el-option :value="2" label="维保等待"></el-option>
            <el-option :value="3" label="维保完成"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="反馈时间" prop="feedBackTime">
          <div class="block" >
            <el-date-picker v-model="maintenanceFrom.feedBackTime" placeholder="请选择反馈时间" type="datetime" style="width: 100%">
            </el-date-picker>
          </div>
        </el-form-item>

        <el-form-item label="反馈详情">
          <el-input type="textarea" v-model="maintenanceFrom.feedBackRemark"></el-input>
        </el-form-item>
      </el-form>
    </div>
    <div slot="footer" style="text-align: center" class="dialog-footer">
      <el-button @click="cancelCommission">取 消</el-button>
      <el-button :loading="addLoading" v-if="createStatus" type="primary" @click="addInMaintenanceFeedbackLogVo">创 建
      </el-button>
      <el-button :loading="addLoading" v-else type="primary" @click="updateInMaintenanceFeedbackLog">更新</el-button>
    </div>

  </div>

</template>

<script>

import {addInMaintenanceFeedbackLogVo, getInMaintenanceFeedbackLog, updateInMaintenanceFeedbackLog} from "@/api/feedbacklog";

import {getMaintenanceRecordList} from "@/api/maintenanceRecord";
import {getInUserList} from "@/api/enterprise";


export default {
  name: "feedbackLogEdit",

  data(){
    return{
      maintenanceFrom:{

      },

      mastercardlogFromRules:{
        mobile: [{required: true, message: '反馈工单号不能为空', trigger: 'blur'}],
        address: [{required: true, message: '反馈人姓名不能为空', trigger: 'blur'}],
      },
      addLoading:false,
      imgFlag:false,
      imgUploadPercent:0,
      reportPersonList:[],
      maintenanceRecordIdList:[]

    }
  },
  computed:{
    createStatus(){
      return this.$route.params.id == '0'
    },
  },
  created() {
    if (!this.createStatus){
      let ucId = this.$route.params.id
      console.log(ucId)
      this.getInMaintenanceFeedbackLog(ucId)
    }
    this.getMaintenanceRecordList()
    this.getInUserList()
  },
  methods:{
    getInMaintenanceFeedbackLog(val){
      getInMaintenanceFeedbackLog({id:val}).then(res=>{
        this.maintenanceFrom = res.data

      }).catch(res=>{

      })
    },
    cancelCommission(){
      window.history.back()
    },
    addInMaintenanceFeedbackLogVo(){
      this.addLoading = true
      this.$refs['maintenanceFrom'].validate(id => {
        if (id){
          addInMaintenanceFeedbackLogVo(this.maintenanceFrom).then(res=>{
            this.addLoading = false
            this.$notify.success({
              title: '成功',
              message: "添加工单状态成功"
            })
            this.cancelCommission()
          }).catch(res=>{
            this.addLoading = false
            this.$notify.error({
              title: '失败',
              message: res.msg
            })
          })
        }else {
          this.addLoading = false
          console.log("表单验证不通过")
        }
      })
    },
    updateInMaintenanceFeedbackLog(){
      this.addLoading = true
      this.$refs['maintenanceFrom'].validate(id => {
        if (id){
          updateInMaintenanceFeedbackLog(this.mastercardlogFromRules).then(res=>{
            this.addLoading = false
            this.$notify.success({
              title: '成功',
              message: "更新工单成功"
            })
            this.cancelCommission()
          }).catch(res=>{
            this.addLoading = false
            this.$notify.error({
              title: '失败',
              message: res.msg
            })
          })
        }else {
          this.addLoading = false
          console.log("表单验证不通过")
        }
      })
    },

    getInUserList() {
      getInUserList({deleted:false}).then(res => {
        this.reportPersonList = res.data
      }).catch(error => {
        console.log(error)
      })
    },
    getMaintenanceRecordList() {
      getMaintenanceRecordList({deleted:false}).then(res => {
        this.maintenanceRecordIdList = res.data;
      }).catch (error => {

      })
    },

  }
}
</script>

<style scoped>

</style>